import Head from 'next/head'
import Router from 'next/router'

Router.onRouteChangeStart = url => {
  console.log('App is changing to: ', url)
}

export default({children, isFlex}) => (
  <div className={isFlex ? 'flexed' : ''}>
    <style jsx>{`
      .flexed {
        display: flex;
        height: 100vh;
        justify-content: center;
        align-items: center;
      }
    `}</style>
    <Head>
      <title>My styled page</title>
      <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no" />
      <link href="/static/antd.css" rel="stylesheet"/>
      <link href="/static/nprogress.css" rel="stylesheet"/>
      <link href='http://cdn.webfont.youziku.com/webfonts/nomal/114705/46715/5a952c97f629d909e4351fcf.css' rel='stylesheet' type='text/css' />
      <link href="/static/reset.css" rel="stylesheet"/>
    </Head>
    {children}
  </div>  
)